<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>数组去重</title>
</head>
<body>
    
    <script>
        var arr = [1,8,'16','5',1,16,'rtd','rtd',2,5,6,5,8];

            // 先定义一个包含原始数组第一个元素的数组，然后遍历原始数组，将原始数组中从第二个元素开始与新数组中的每个元素进行比对，如果不重复则添加到新数组中，最后返回新数组
        function unique1(arr) {
            if (!Array.isArray(arr)) {
                console.log('type error!')
                return
            }
            let res = [arr[0]]
            for (let i = 1; i < arr.length; i++) { // 注意，arr数组是从第二个元素开始遍历的
                let flag = true
                for (let j = 0; j < res.length; j++) {
                    if (arr[i] === res[j]) {
                        flag = false;
                        break // 结束当前循环
                    }
                }
                if (flag) {
                    res.push(arr[i])
                }
            }
            return res
        }
            //console.log(unique1(arr))

        
        /**
        * 通过数组的indexOf方法去重 1
        * 声明一个空数组res，遍历arr，如果res中不存在当前遍历的元素，就把当前遍历的元素push到res中
        * return res数组
        */
        function unique2(arr){
            if(!Array.isArray(arr)){
                console.log('Type Error');
                return;
            }
            let res = [];
            for(var i = 0;i < arr.length;i++){
                if(res.indexOf(arr[i]) === -1){
                    res.push(arr[i]);
                }
            }
            return res;
        }
        // console.log(unique2(arr)) 


        /**
        * 通过数组的indexOf方法去重 2
        * 使用filter过滤函数遍历，如果当前遍历的值item在arr中第一次出现的位置[arr.indexOf(item)]等于该元素在arr中的位置
        * 则说明当前遍历的元素item在arr中不存在重复
        * return filter后的数组
        */
        function unique3(arr){
             if (!Array.isArray(arr)) {
                console.log('type error!')
                return
            }

            return arr.filter(function(item,index){
                return arr.indexOf(item) === index   // 返回符合arr.indexOf(item) === index的item
            })
        }   
        console.log('第三种：' + unique3(arr))

            /**
            * 通过数组的sort方法去重
            * 将arr数组排序，声明新数组res，遍历arr，如果相邻的两个元素不相等，就说明当前遍历的值不存在重复
            * 将当前值push到res数组中
            * return res
            */
            function unique4(arr) {
                if (!Array.isArray(arr)) {
                    console.log('type error!')
                    return
                }
                arr = arr.sort();
                let res = []
                for(var i = 0;i < arr.length;i++){
                    if(arr[i] != arr[i+1]){
                        res.push(arr[i])
                    }
                }
                return res
                
            }
            console.log(unique4(arr))


            /**
            * 通过对象属性去重
            * 将arr的元素做为obj对象的属性，如果当前遍历的元素在obj对象中找不到对应的属性，则给该属性赋值为1，将当前元素push到res中，如果找到了对应的属性，则说明当前遍历的元素在arr中已经存在了，把obj对应的属性的值加1
            * 则说明当前遍历的元素item在arr中不存在重复
            * return filter后的数组
            */
            function unique5(arr) {
                if (!Array.isArray(arr)) {
                    console.log('type error!')
                    return
                }
                let res = [];
                let obj = {};  // 记录arr每个元素重复的次数
                for(var i = 0;i < arr.length;i++){
                    if(!obj[arr[i]]){
                        res.push(arr[i]);
                        obj[arr[i]] = 1;
                    }else {
                        obj[arr[i]] ++
                    }
                }
                return [res,obj]

            }
            console.log(unique5(arr)[0]) // res
            console.log(unique5(arr)[1]) // obj



              /**
               * 通过ES6新数据类型set去重
               * 
               * 
               * 
               */
                function unique6(arr) {
                    if (!Array.isArray(arr)) {
                        console.log('type error!')
                        return
                    }
                    return [...new Set(arr)]

                }
                console.log(unique6(arr)) 
    </script>
</body>
</html>